<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../index/css/index.css" />
    <link rel="stylesheet" href="./css/animate.min.css" />
    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./js/index.js"></script>
    <title>首页</title>
</head>

<body>
    <script>
    </script>
    <div class="box">
        <div class="head">
            <div class="heads">
                <div class="head_top flex">
                    <div class="tou_zuo1">
                        <img src="./img/a3.png" alt="">
                        <img src="./img/a4.png" alt="">
                        <img src="./img/a5.png" alt="">
                        <img src="./img/a6.png" alt="">
                        <img src="./img/a7.png" alt="">
                    </div>
                    <div class="tou_you1 flex">
                        <div class="xin">
                            <img src="./img/a1.png" alt=""><span class="email"> ContacUst@Gmail.com</span>
                        </div>
                        <div class="xin">
                            <img src="./img/a2.png" alt=""><span class="email"> 80 888887</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="heads1">
                <div class="head_bottom flex">
                    <div class="bott_zuo"><img src="./img/a.png" alt=""></div>
                    <div class="bott_you">
                        <ul class="flex ul1">
                            <li><a href="index.html">HOME</a></li>
                            <li><a href="blog.html">BLOG</a></li>
                            <li><a href="about.html">ABOUT US</a></li>
                            <li><a href="contact.html">CONTACT</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- 头结束 -->
        <!-- banner部分 -->
        <div class="banner">
            <div class="banner_main">
                <div class="banner_one">
                    <p class="p1">SEE THE WORD DIFFERENTLY</p>
                    <P>Request,design and book travel experiences as unique as you are</P>
                </div>
                <div class="banner_two">
                    <input type="text" id="in1" placeholder="Where are you going?">
                    <button><img src="./img/c8.png" alt=""> Search</button>
                </div>
                <div class="banner_three">
                    <ul>
                        <li>TOP DESTINATION:</li>
                        <li>PARIS</li>
                        <li>NEW YORK</li>
                        <li>LONDON</li>
                        <li>ROME</li>
                        <li>SAN FRANGISCO</li>
                        <li>MORE...</li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 第三部分 -->
        <div class="content">
            <div class="contents flex">
                <div class="fangda wow fadeInUp animated" data-wow-duration="2s" data-wow-delay="100ms" style="
                  visibility: visible;
                  animation-duration: 2s;
                  animation-delay: 100ms;
                  animation-name: fadeInUp;
                ">
                    <img src="./img/c2 .png" alt="">
                    <p class="p2">Civita di Bagnoregio,Itaila</p>
                    <div class="p34">
                        <p class="p3">April 14,2015</p>
                        <p class="p4">Uploaded by <span>john Deo</span></p>
                    </div>

                </div>
                <div class="fangda wow fadeInUp animated" data-wow-duration="2s" data-wow-delay="100ms" style="
                  visibility: visible;
                  animation-duration: 2s;
                  animation-delay: 100ms;
                  animation-name: fadeInUp;
                ">
                    <img src="./img/c2 .png" alt="">
                    <p class="p2">Civita di Bagnoregio,Itaila</p>
                    <div class="p34">
                        <p class="p3">April 14,2015</p>
                        <p class="p4">Uploaded by <span>john Deo</span></p>
                    </div>
                </div>
                <div class="fangda wow fadeInUp animated" data-wow-duration="2s" data-wow-delay="100ms" style="
                  visibility: visible;
                  animation-duration: 2s;
                  animation-delay: 100ms;
                  animation-name: fadeInUp;
                ">
                    <img src="./img/c2 .png" alt="">
                    <p class="p2">Civita di Bagnoregio,Itaila</p>
                    <div class="p34">
                        <p class="p3">April 14,2015</p>
                        <p class="p4">Uploaded by <span>john Deo</span></p>
                    </div>
                </div>
            </div>
        </div>
        <!-- ABOUT US -->
        <div class="about">
            <div class="about_us">
                <div class="abuot_top">
                    <h1>ABOUT US</h1>
                    <p>Nulla eget mauris quis elit mollis ornare vitae ut odio.Cras tincidunt, augue vitae sollicitudin commodo, quam elit varius est,et ornare ante massa quis tellus. Mauris nec lacinia nisl.Curabitur tempus tellus et vulputate vestibulum.</p>
                </div>
                <div class="about_bottom flex">
                    <div class="about_fd">
                        <div class="tu1">
                            <img src="./img/a8.png" alt="" class="img">
                            <img src="./img/a8_0.png" alt="" class="imgs">
                        </div>
                        <div class="p56">
                            <p class="p5">Lorem ipsum dolor</p>
                            <p class="p6">Lorem ipsum dolor sit amet,consectetuer adipiscing elit, sed euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad</p>
                        </div>

                    </div>
                    <div class="about_fd">
                        <div class="tu1">
                            <img src="./img/a8.png" alt="" class="img">
                            <img src="./img/a8_0.png" alt="" class="imgs">
                        </div>
                        <div class="p56">
                            <p class="p5">Lorem ipsum dolor</p>
                            <p class="p6">Lorem ipsum dolor sit amet,consectetuer adipiscing elit, sed euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad</p>
                        </div>
                    </div>
                    <div class="about_fd">
                        <div class="tu1">
                            <img src="./img/a8.png" alt="" class="img">
                            <img src="./img/a8_0.png" alt="" class="imgs">
                        </div>
                        <div class="p56">
                            <p class="p5">Lorem ipsum dolor</p>
                            <p class="p6">Lorem ipsum dolor sit amet,consectetuer adipiscing elit, sed euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad</p>
                        </div>
                    </div>
                </div>
                <div class="button1"><button>MORE</button></div>

            </div>
        </div>
        <!-- 第五部分 -->
        <div class="tu2">
            <p>Curabitur pharetra sed magna at tincidunt. Maecenasauctor tincidunt ex Aliquam a vestibulum Donec diam ipsum euismod.</p>
        </div>
        <!-- services -->
        <div class="services">
            <div class="services_main">
                <div class="ser_top abuot_top">
                    <h1>SERVICES</h1>
                    <p>Nulla eget mauris quis elit mollis ornare vitae ut odio.Cras tincidunt, augue vitae sollicitudin commodo, quam elit varius est,et ornare ante massa quis tellus. Mauris nec lacinia nisl.Curabitur tempus tellus et vulputate vestibulum.</p>
                </div>
                <div class="ser_bottom ">
                    <div class="four_ser flex">
                        <div class="ser_box">
                            <img src="./img/b1.png" alt="" class="tu3">
                            <img src="./img/b1_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b2.png" alt="" class="tu3">
                            <img src="./img/b2_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b3.png" alt="" class="tu3">
                            <img src="./img/b3_).png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b4.png" alt="" class="tu3">
                            <img src="./img/b4_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                    </div>
                    <div class="four_ser flex">
                        <div class="ser_box">
                            <img src="./img/b5.png" alt="" class="tu3">
                            <img src="./img/b5_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b6.png" alt="" class="tu3">
                            <img src="./img/b6_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b7.png" alt="" class="tu3">
                            <img src="./img/b7_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                        <div class="ser_box">
                            <img src="./img/b8.png" alt="" class="tu3">
                            <img src="./img/b8_0.png" alt="" class="tu4">
                            <p>Henderit Mauris</p>
                            <p> Praesent vestibuluolestie lacus</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 第七部分 -->
        <div class="tu2">
            <p>Curabitur pharetra sed magna at tincidunt. Maecenasauctor tincidunt ex Aliquam a vestibulum Donec diam ipsum euismod.</p>
        </div>
        <!-- 第八部分 -->
        <div class="comment">
            <div class="comments flex">
                <div class="com_zuo wow" data-wow-duration="2s" data-wow-delay="100ms" style="
                visibility: visible;
                animation-duration: 2s;
                animation-delay: 100ms;
                animation-name: fadeInUp;
              ">
                    <div class="zuocom_top flex">
                        <div class="top_left"><img src="./img/c5.png" alt=""></div>
                        <div class="top_right">
                            <h3>Nam libero tempore, cumsoluta nobis</h3>
                            <p class="p7">By <span>Danny</span> on April 14, 2015</p>
                            <p class="p8">Nam libero tempore,cum soluta nobis est eligendi optio cumque quod maxime placeat facere possimus nihil impedit quo minus id quod maxime placeat facere possimus.
                            </p>
                        </div>
                    </div>
                    <div class="zuocom_bot flex">
                        <div class="c4">
                            <img src="./img/c4.png" alt="">
                            <p>Nam libero tempore, cum soluta nobis</p>
                        </div>
                        <div class="c4">
                            <img src="./img/c4.png" alt="">
                            <p>Nam libero tempore, cum soluta nobis</p>
                        </div>
                        <div class="c4">
                            <img src="./img/c4.png" alt="">
                            <p>Nam libero tempore, cum soluta nobis</p>
                        </div>
                    </div>
                </div>
                <div class="com_you wow" data-wow-duration="2s" data-wow-delay="100ms" style="
                visibility: visible;
                animation-duration: 2s;
                animation-delay: 100ms;
                animation-name: fadeInUp;
              ">
                    <h1>Latest News</h1>
                    <div class="xian flex">
                        <div class="xian1">&nbsp;</div>
                        <div class="xian2"> &nbsp;</div>
                    </div>
                    <ul class="lates">
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                        <li>> Lorem ipsum dolor sit amet, consectetur</li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 底部 -->
        <div class="foot">
            <!-- 100 -->
            <div class="foot_top">
                <!-- 80 -->
                <div class="ftop_main flex">
                    <div class="ftm_box1">
                        <div class="logo_zi">z<span class="span1">Vossen</span>
                            <p>Travel and Tours</p>
                        </div>
                        <div class="p9">
                            <p>Nam libero tempore,cum soluta nobis est eligendi optio cumque quod maxime placeat cum soluta nobis facere possimus nihil impedit quo minus id quod maxime placeat facere possimus.est eligendi optio cumque </p>
                            <p>facere possimus nihil impedit quo minusid quod maxime placeat facere possimus.</p>
                        </div>

                    </div>
                    <div class="ftm_box2">
                        <h2>News Letter</h2>
                        <div class="xian flex">
                            <div class="xian1">&nbsp;</div>
                            <div class="xian2"> &nbsp;</div>
                        </div>
                        <p class="p10">facere possimus nihil impedit quo minus id quod maxime placeat facere possimus. est eligendi</p>
                        <input type="text" id="inp2" placeholder="Enter your email address...">
                        <button class="but2">SUBCRIBE NOW</button>
                    </div>
                    <div class="ftm_box3">
                        <h2>News Letter</h2>
                        <div class="xian flex">
                            <div class="xian1">&nbsp;</div>
                            <div class="xian2"> &nbsp;</div>
                        </div>
                        <div class="four_img flex">
                            <div class="img2"><img src="./img/c2 .png" alt=""></div>
                            <div class="img2"><img src="./img/c2 .png" alt=""></div>
                            <div class="img2"><img src="./img/c2 .png" alt=""></div>
                            <div class="img2"><img src="./img/c2 .png" alt=""></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="foot_bot">
                <div class="fbot_main">
                    Copyright 2015.Company name All rights reserved.
                </div>
            </div>
        </div>

    </div>
</body>
<script src="../assets/js/index.js"></script>
<script defer src="../common/bootstrap/bootstrap.bundle.min.js"></script>
<script defer src="../common/wow.min.js"></script>


</html>